<!DOCTYPE html>
<html>
<head>
  <title>创建新工单</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
      background-color: #f1f1f1;
      color: #333;
    }
    
    h1 {
      background-color: #007bff;
      color: #fff;
      padding: 10px;
      text-align: center;
    }
    
    form {
      max-width: 100%;
      margin: 20px auto;
      padding: 20px;
      background-color: #fff;
      border-radius: 5px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }
    
    label {
      font-weight: bold;
    }
    input[type="text"]{
      width: 100%;
      padding: 5px;
      margin: 5px 0;
      border: 1px solid #ccc;
      border-radius: 3px;
      resize: vertical; 
    }
    
    textarea {
      width: 100%;
      padding: 5px;
      margin: 5px 0;
      border: 1px solid #ccc;
      border-radius: 3px;
      height: 50vh; /* 设置描述框的高度为视窗高度的50% */
    }
    
    input[type="submit"] {
      display: block;
      width: 100%;
      padding: 10px;
      margin: 10px 0;
      background-color: #007bff;
      color: #fff;
      border: none;
      border-radius: 5px;
      cursor: pointer;
    }
    
    input[type="submit"]:hover {
      background-color: #0056b3;
    }
  </style>
</head>
<body>
  <h1>创建新工单</h1>
  <form action="/repairs" method="post" enctype="multipart/form-data">
    <label for="title">标题：</label>
    <input type="text" name="title" id="title" required>
    <br>
    <label for="description">描述：</label>
    <textarea name="description" id="description" required></textarea>
    <br>
    <label for="images">选择图片：</label>
    <input type="file" id="images" name="images" accept="image/*" multiple>
    <br>
    <input type="submit" value="提交">
</form>

</body>
</html>
